<template>
  <div>
     <button @click="run">浪起来</button>
     <button @click="remove">停止</button>
     <h3>{{msg}}</h3>
     <ul>
      <li v-for="item in 4" :key="item">{{item}}</li>
     </ul>
   </div>
</template>
 
<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      msg:"我是谁，我在哪~",
      timer:null,
      arr:[123,34,453]
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    /* run(){
      if(this.timer)clearInterval(this.timer)
      this.timer=setInterval(()=>{
        const arr=this.msg.split("")
        arr.push(arr.shift())
        this.msg=arr.join("")
      },1000)
    }, */
    run(){
      if(this.timer)return
      this.timer=setInterval(() => {
        this.msg=this.msg.slice(1)+this.msg.slice(0,1)
      }, 1000);
    },
    remove(){
      if(this.timer)clearInterval(this.timer)
    }
  }
};
</script>

<style scoped>
     
</style>